<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <title>Title</title>
  <link rel="stylesheet" href="${pageContext.request.contextPath}/layui/css/layui.css">
  <script src="${pageContext.request.contextPath}/layui/layui.js"></script>
</head>
<body>

<form style="display: none;" class="layui-form" lay-filter="branchForm" id="branchForm">
  <div class="layui-form-item"  lay-filter="seleDiv" id="seleDiv">
    <label class="layui-form-label">分店</label>
    <div class="layui-input-inline">
      <select name="branchid" id="branchidSel">
        <option value="">选择搜索的门店</option>
      </select>
    </div>
  </div>
  <div class="layui-form-item">
    <div class="layui-input-inline" style="margin-left: 100px">
      <button class="layui-btn" lay-submit lay-filter="tijiao" id="tijiao" >立即提交</button>
      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
  </div>
</form>

<div class="demoTable layui-form">
  <div class="layui-inline" style="margin-top: 15px">
    <div class="layui-form-item">
      <div class="layui-input-inline">
        <select id="branchidSel1" name="branchid" lay-verify="required">
          <option value="">门店</option>
        </select>
      </div>
    </div>
  </div>
  <button class="layui-btn" id="reloadTabBtn" data-type="reload">搜索</button>
</div>

<table id="demo" lay-filter="test"></table>
<%--头部工具栏--%>
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
            <%--<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>--%>
    <%--        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>--%>
    <button class="layui-btn layui-btn-sm" lay-event="piliang">批量出库</button>
    <button class="layui-btn layui-btn-sm" lay-event="pingdiao" id="pingdiao">平调出库</button>
    <button class="layui-btn layui-btn-sm" lay-event="isAll">刷新</button>
  </div>
</script>

<%--右侧工具栏--%>
<script type="text/html" id="barDemo">
  <a class="layui-btn layui-btn-xs" lay-event="retail">零售</a>
  <%--<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="pingdiao">平调出库</a>--%>
</script>
<%--商品状态的模板--%>
<script type="text/html" id="titleTpl">
  {{#  if(d.state == 1){ }}
  <button class="layui-btn layui-btn-sm">在售</button>
  {{#  } else { }}
  <button class="layui-btn layui-btn-danger layui-btn-sm">未售</button>
  {{#  } }}
</script>
<script>
  layui.use(['table','form','jquery','layer'], function(){
    var table = layui.table;
    var form = layui.form;
    var $ = layui.jquery;
    var layer = layui.layer;


    $.ajax({
      url: '${pageContext.request.contextPath}/type/getAllType',
      type: 'get',
      dataType: 'json',
      success: function (types) {
        console.log(types)
        $.each(types, function (i, obj) {
          $("#branchidSel1").append(
                  $("<option></option>").attr("value", obj.branchid).text(obj.branchname)
          )
        })
        form.render('select');
      }
    })

    $.ajax({
      url: '${pageContext.request.contextPath}/type/getAllType3',
      type: 'get',
      dataType: 'json',
      success: function (types) {
        $.each(types, function (i, obj) {
          $("#branchidSel").append(
                  $("<option></option>").attr("value", obj.branchid).text(obj.branchname)
          )
        })
        form.render('select');
      }
    })


    $("#reloadTabBtn").click(function (){
      table.reload('tb',{
        where: { //设定异步数据接口的额外参数
          bid:$("#branchidSel1").val()
        }
        ,page: {
          curr: 1 //重新从第 1 页开始
        }
      });
    })

    //加载表格的实例
    table.render({
      id:"tb",
      //elem element 元素---》表格的容器
      elem: '#demo'//table标签的id属性值
                                                //获取商品信息
      ,url: '${pageContext.request.contextPath}/goods/getAllOutGoods' //数据接口
      ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
      ,cols: [[ //表头
        {type: 'checkbox', fixed: 'left'}
        ,{field:'goodsid', title:'商品编号',fixed: 'left',sort: true}
        ,{field:'url', title:'商品图片',height:50,templet:function (data) {
            var a=data.url
            return "<Img src='"+a+"' style='width: 100px;height: 50px'>"
          }}
        ,{field:'goodsname', title:'商品名称'}
        ,{field:'layout', title:'键盘布局'}
        ,{field:'goods.keycapid', title:'键帽材质',templet: function (data) {
            //console.log(data);
            return data.keycap==null?"":data.keycap.keycapname;
          }}
        ,{field:'goods.keyboardcolorid', title:'键盘颜色',templet: function (data) {
            //console.log(data);
            //return data.keyboardcolor.keyboardcolorname;
            return data.keyboardcolor==null?"":data.keyboardcolor.keyboardcolorname;
          }}
        ,{field:'shafttype', title:'轴体类型'}
        ,{field:'goods.shaftchooseid', title:'轴体选择',templet: function (data) {
            //console.log(data);
            //return data.shaftchoose.shaftchoose;
            return data.shaftchoose==null?"":data.shaftchoose.shaftchoose;
          }}
        ,{field:'interfacetype', title:'接口类型'}
        ,{field:'goods.backlightcolorid', title:'背光颜色',templet: function (data) {
            //console.log(data);
            //return data.backlightcolor.backlightcolorname;
            return data.backlightcolor==null?"":data.backlightcolor.backlightcolorname;
          }}
        ,{field:'cprice', title:'商品进价'}
        ,{field:'sprice', title:'商品售价'}
        ,{field:'branchname', title:'店铺名称'}
        ,{field:'counts', title:'商品数量'}
        ,{field: 'chuKuNum', title: '出库数量',edit:'text',id:"chuKuNum"}
        /*,{field:'state', title:'状态' ,templet:'#titleTpl'}*/
        ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:200}
      ]],
      text:{
        none:"无数据"
      },
      page:true,//开启分页
      limit:5,//默认每页显示的条数
      limits:[5,10,15,20]//自定义分页条数的选择
    });

    //头工具栏事件
    //toolbar()括号中的参数就是  table容器中 lay-filter属性的值
    table.on('toolbar(test)', function(obj){
      var checkStatus = table.checkStatus(obj.config.id);
      switch(obj.event){
              /**
               * case后边的具体字符串跟 toolbarDemo中的 lay-event属性值一样
               */
        case 'getCheckData':
          var data = checkStatus.data;
          layer.alert(JSON.stringify(data));
                      //将一个 JavaScript 对象或值转换为 JSON 字符串
          break;
        case 'getCheckLength':
          var data = checkStatus.data;
          layer.msg('选中了：'+ data.length + ' 个');
          break;
        case 'isAll':
          table.reload("tb");
          break;
        //批量出库
        case 'piliang':
          if (checkStatus.data.length>0){
            var data = checkStatus.data;
            var flag=1;
            var aaa=${sessionScope.staff.branchid};
            $.each(data,function (i,val) {
              var chuKuNum =val.chuKuNum;
              var branchid= val.branchid;
              if(branchid!=aaa){
                flag=0;
                layer.msg("对不起,你没有权限")
              }
              if (chuKuNum=='' || isNaN(chuKuNum)||!(/(^[1-9]\d*$)/.test(chuKuNum))){
                flag=0;
                layer.msg("请检查你的数据格式")
              }
            })
            if (flag==1){
              layer.confirm('进行批量出库申请吗？', function(index){
                $.ajax({
                  url: "${pageContext.request.contextPath}/outLibrary/batch",
                  type:"post",
                  dataType: "json",
                  // contentType:'application/json;charset=utf-8',
                  data:{"batchGoods":JSON.stringify(data)},
                                    //将一个 JavaScript 对象或值转换为 JSON 字符串
                  success: function (result) {
                    layer.closeAll();
                    if (result.code==1) {
                      //重载表格
                      table.reload("tb");
                      layer.msg(result.msg);
                    } else {
                      layer.msg(result.msg);
                    }
                  }
                });
              });
            }

          } else {
            alert("请选择要申请出库的数据！")
          }
          break;
          //平调出库
        case 'pingdiao':
          if (checkStatus.data.length>0){
            var data = checkStatus.data;
            var flag=1;
            var aaa=${sessionScope.staff.branchid};
            $.each(data,function (i,val) {
              var chuKuNum =val.chuKuNum;
              var branchid= val.branchid;
              if(branchid!=aaa){
                flag=0;
                layer.msg("对不起,你没有权限")
              }
              if (chuKuNum=='' || isNaN(chuKuNum)||!(/(^[1-9]\d*$)/.test(chuKuNum))){
                flag=0;
                layer.msg("请检查你的数据格式")
              }
            })
            if (flag==1){
              layer.confirm('进行平调出库申请吗？', function(index){
                layer.open({
                  type: 1,
                  content: $("#branchForm"), //这里content是一个普通的String
                  area: ['380px','300px'],
                  offset: 't'
                });
                var checkAll = checkStatus.data;
                form.on('submit(tijiao)', function(data){
                  //获取表单区域所有值
                  var userData = form.val("branchForm");
                  console.log(userData);
                  $.ajax({
                    url: "${pageContext.request.contextPath}/outLibrary/transferOutLibrary",
                    type:"post",
                    dataType: "json",
                    // contentType:'application/json;charset=utf-8',
                    data:{"batchGoods":JSON.stringify(checkAll),"branchid":userData.branchid},
                                      //将一个 JavaScript 对象或值转换为 JSON 字符串
                    success: function (result) {
                      layer.closeAll();
                      if (result.code==1) {
                        //重载表格
                        table.reload("test");
                        layer.msg(result.msg);
                      } else {
                        layer.msg(result.msg);
                      }
                    }
                  });
                });
              });
            }
          } else {
            alert("请选择要平调出库的数据！")
          }
          break;
      };
    });

    //零售
    //监听行工具事件------
    ////tool()括号中的参数就是  table容器中 lay-filter属性的值
    table.on('tool(test)', function(obj){
      //取出当前点击的行的数据
      var data = obj.data;
      console.log(data);
      if(obj.event === 'retail'){  //-----零售出库
        var flag=1;
        var aaa=${sessionScope.staff.branchid};
        var branchid= data.branchid;
        if(branchid!=aaa){
          flag=0;
          layer.msg("对不起,你没有权限出库该分店商品")
        }
        if (data.chuKuNum > data.counts) {
          flag=0;
          layer.msg("零售商品数量大于库存！")
        }
        if (data.chuKuNum > 5) {
          flag=0;
          layer.msg("零售商品数量大于5，请选择批量！")
        }
        if (data.chuKuNum < 0) {
          flag=0;
          layer.msg("零售商品数量有误，请重新输入！！")
        }
        if (data.chuKuNum == null) {
          flag = 0;
          layer.msg("请填入你想要零售的数量！")
        }
        if (flag==1){
          $.ajax({
            url:"${pageContext.request.contextPath}/outLibrary/retailOutLibrary",
            data:{"branchid":data.branchid,"goodsid":data.goodsid,"count":data.count,"chuKuNum":data.chuKuNum},
            type:"POST",
            dataType:'json',
            success:function (result) {
              if (result.code==1){
                table.reload('tb')
                layer.msg(result.msg);
              } else {
                layer.msg(result.msg);
              }
            }
          });
        }
      }
    });
  });
</script>
</body>
</html>
